
<template>
  <div class="gl_contentBox gl_heightFull">
    <div class="nav">
      <el-form el-form class="gl_contentBox" style="border-radius:10px;padding-top:30px" :model="StudentInfoInput" label-position="right" label-width="100px">
        <el-row>
          <el-col>
            <span style="font-size:20px;margin-top:16px;margin-bottom:16px">会籍信息</span>
          </el-col>
        </el-row>
        <div class="navForm" style="margin-top:16px">
          <div class="left">
            <div>
              <el-row>
                <el-col>
                  <el-form-item label="学员编号">
                    <el-input v-model="StudentInfoInput.studentNumber" type="text" style="width:390px" size="mini" maxlength="16" />
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col>
                  <el-form-item label="入馆时间">
                    <el-date-picker
                      v-model="StudentInfoInput.joiningTime"
                      type="date"
                      size="mini"
                      format="yyyy-MM-dd"
                      value-format="yyyy-MM-dd"
                      style="width: 390px"
                    />
                  </el-form-item>
                </el-col>
              </el-row>
            </div>
            <div>
              <el-row>
                <el-col>
                  <el-form-item label="紧急联系方式">
                    <div v-for="(item,index) in Contact" :key="index" style="width:360px">
                      <div v-if="item.operatorType !== 'D'" style="display:flex">
                        <el-select v-model="item.contactTypeCode" size="mini" @change="colseContact(index)">
                          <el-option v-for="(jtem,jndex) in dict.contactType" :key="jndex" :value="jtem.code" :label="jtem.value" />
                        </el-select>
                        <el-input v-model="item.phoneNumber" style="width:140px;margin-left:10px;margin-right:10px" size="mini" type="number" @change="colseContact(index)" />
                        <el-button size="mini" style="height:28px;margin-top:4px" icon="el-icon-error" @click="stopContact(index)" />
                      </div>
                    </div>
                    <el-button size="mini" icon="el-icon-circle-plus-outline" @click="addContact" />
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col>
                  <el-form-item v-model="StudentInfoInput.classNames" label="专属教练">
                    <span v-for="(item,index) in coachlistData" :key="index">
                      <el-tag v-if="item.operatorType !== 'D'" closable style="margin-right:10px" @close="closeT(index)">
                        {{ item.name }}
                      </el-tag>
                    </span>
                    <el-button size="mini" icon="el-icon-circle-plus-outline" @click="addTeacher" />
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col>
                  <el-form-item v-model="StudentInfoInput.classNames" label="班级">
                    <span v-for="(item,index) in classlistData" :key="index">
                      <el-tag v-if="item.operatorType !== 'D'" closable style="margin-right:10px" @close="closeC(index)">{{ item.name }}</el-tag>
                    </span>
                    <el-button size="mini" icon="el-icon-circle-plus-outline" @click="addClass" />
                  </el-form-item>
                </el-col>
              </el-row>
            </div>

          </div>
        </div>
      </el-form>
    </div>
    <!-- 添加教练弹窗 -->
    <el-dialog
      title="添加教练"
      class="gl_dialog_TitleLine gl_dl_footer"
      :visible.sync="dialogTeaVisible"
      :close-on-click-modal="false"
      width="1032px"
      top="25vh"
    >
      <el-input v-model="Api_GET_ClubCoachQO.Filter" placeholder="请输入教练名称或手机号" clearable prefix-icon="el-icon-search" style="margin-top:14px;margin-bottom:16px;border-radio:20px;overflow:hidden" @change="getteachlist()" />
      <el-scrollbar>
        <el-table ref="multipleTable" v-loading="tableLoading" size="mini" class="gl_table_noBorder table_teach" :data="coachlist" @selection-change="selectioncoach">
          <el-table-column type="selection" label-class-name="selection" />
          <el-table-column label="教练姓名" prop="name" />
          <el-table-column label="手机号" prop="phoneNumber" />

        </el-table>
        <el-row class="gl_pt_20" style="text-align: right;">
          <el-pagination
            :current-page="Api_GET_ClubClassQO.Page"
            :page-size="Api_GET_ClubClassQO.MaxResultCount"
            :total="totalPage1"
            layout="total,sizes,prev,pager,next,jumper"
            :page-sizes="[10, 20, 30, 40]"
            @size-change="sizeChange1"
            @current-change="pageIndexChange1"
          />
        </el-row>
      </el-scrollbar>
      <span slot="footer" class="dialog-footer">
        <!-- 取消按钮 -->
        <el-button size="mini" @click="dialogTeaVisible = false">{{ $t('button.cancel') }}</el-button>
        <!-- 编辑的保存按钮 -->
        <el-button size="mini" type="primary" :loading="addfalse" @click="addT">确 定</el-button>
      </span>
    </el-dialog>
    <!-- 添加班级弹窗 -->
    <el-dialog
      title="添加班级"
      class="gl_dialog_TitleLine gl_dl_footer"
      :visible.sync="dialogClasVisible"
      :close-on-click-modal="false"
      width="1032px"
      top="25vh"
    >
      <el-input v-model="Api_GET_ClubClassQO.Filter" placeholder="请输入班级名称或课程名称" clearable prefix-icon="el-icon-search" style="margin-top:14px;margin-bottom:16px;border-radio:20px;overflow:hidden" @change="getClasslist()" />
      <el-scrollbar>
        <el-table ref="multipleTable" v-loading="tableLoading" size="mini" class="gl_table_noBorder" :row-key="(row)=>{return row.id}" :data="classlist" @selection-change="selectionclass">
          <el-table-column type="selection" label-class-name="selection" :reserve-selection="true" />
          <el-table-column label="班级名称" prop="name" />
          <el-table-column label="关键课程" align="center">
            <template slot-scope="{ row }">
              <span v-for="(item,index) in row.courses" :key="index">
                {{ item.name }}
              </span>
            </template>
          </el-table-column>
          <el-table-column label="人数/上限" align="center">
            <template slot-scope="{ row }">
              <span>{{ row.studentCount }}</span> / <span>{{ row.maxStudentCount }}</span>
            </template>
          </el-table-column>
        </el-table>
        <el-row class="gl_pt_20" style="text-align: right;">
          <el-pagination
            :current-page="Api_GET_ClubClassQO.Page"
            :page-size="Api_GET_ClubClassQO.MaxResultCount"
            :total="totalPage"
            layout="total,sizes,prev,pager,next,jumper"
            :page-sizes="[10, 20, 30, 40]"
            @size-change="sizeChange"
            @current-change="pageIndexChange"
          />
        </el-row>
      </el-scrollbar>
      <span slot="footer" class="dialog-footer">
        <!-- 取消按钮 -->
        <el-button size="mini" @click="dialogClasVisible = false">{{ $t('button.cancel') }}</el-button>
        <!-- 编辑的保存按钮 -->
        <el-button size="mini" type="primary" :loading="addfalse" @click="addC">确 定</el-button>
      </span>
    </el-dialog>
    <!-- 编辑卡片记录 -->
    <el-dialog
      :title="cardname"
      class="gl_dialog_TitleLine gl_dl_footer card"
      :visible.sync="dialogTimeVisible"
      :close-on-click-modal="false"
      width="1002px"
      top="25vh"
    >
      <el-scrollbar>
        <el-timeline>
          <el-timeline-item v-for="(item, index) in makeCard" :key="index" :timestamp="item.creationTime | FormatDate('yyyy-MM-dd HH:mm:ss')" placement="top">
            <template slot-scope>
              <el-card shadow="never" class="time" body-style="background: #F1F1F1">
                <div slot="header" class="clearfix" style="display:flex">
                  <span class="edit_name">{{ item.operatingType }}</span>
                  <span style="display:flex;margin-left:200px;font-size:16px;color:#353434">操作人:  <span class="makepeople">{{ item.operatingAccount }}</span></span>
                </div>
                <div>
                  <p style="font-size:14px;color:#666666">{{ item.operatingInfo }}</p>
                </div>
              </el-card>
            </template>
          </el-timeline-item>
        </el-timeline>
      </el-scrollbar>
      <span slot="footer" class="dialog-footer">
        <!-- 编辑的保存按钮 -->
        <!-- <el-button size="mini" type="primary" @click="dialogTimeVisible = false">返 回</el-button> -->
      </span>
    </el-dialog>
    <div class="gl_contentBox" style="margin-top:10px;border-radius:10px">
      <p style="margin-top:16px;margin-bottom:8px;font-size:20px;">道馆会员卡信息</p>
      <div v-if="cardTable.length>0" class="nav_card ">
        <div v-for="(item,index) in cardTable " :key="index" class="card" style="margin-right:19px;margin-top:19px">
          <div style="background: rgba(64,158,255,0.06);width:378px;border-radius:10px;padding-bottom:33px" shadow="never">
            <div slot="header" class="clearfix" style="hieght:30px;padding-left:20px;padding-top:10px">
              <span class="member_card">{{ item.name }}</span>
              <el-button type="text" size="medium" icon="iconfont icon_xiugai" style="font-size:18px;margin-left:10px;color:rgba(0,0,0,0.50);" @click="editCard(item)" />
              <el-button type="text" size="medium" icon="el-icon-time" style="font-size:18px;color:rgba(0,0,0,0.50);margin-left:15px" @click="checkCard(item)" />
            </div>
            <p style="height:1px;background:rgba(64,158,255,0.10)" />
            <div class="text item" style="padding-left:20px;font-size:14px">
              <p>
                <span style="display:inline-block;color:#ABAEB3;width:80px;margin-top:20px;margin-right:27px">编号</span>
                <el-popover placement="bottom" width="" trigger="hover" :content="item.cardNumber + ''">
                  <span slot="reference" class="table_name">{{ item.cardNumber ? item.cardNumber.length > 14 ? item.cardNumber.substr(0, 14) + '...' : item.cardNumber : '--' }}</span>
                </el-popover>
              </p>
              <p>
                <span style="display:inline-block;color:#ABAEB3;width:80px;margin-top:10px;margin-right:27px">卡内课时:</span>
                <el-popover placement="bottom" width="" trigger="hover" :content="item.classPeriod + ''">
                  <span slot="reference" class="table_name">{{ item.remainClassPeriod }}</span>
                </el-popover>
              </p>
              <p>
                <span style="display:inline-block;color:#ABAEB3;width:80px;margin-top:10px;margin-right:24px">有效期:</span>
                <span v-if="item.effectiveDate">
                  {{ item.effectiveDate | FormatDate('yyyy-MM-dd HH:mm:ss') }}
                </span>
              </p>
              <p>
                <span style="display:inline-block;color:#ABAEB3;width:80px;margin-top:10px;margin-right:24px">激活时间:</span>
                <span v-if="item.enableDate">
                  {{ item.enableDate | FormatDate('yyyy-MM-dd HH:mm:ss') }}
                </span>
                <span v-else>--</span>
              </p>
              <p>
                <span style="display:inline-block;color:#ABAEB3;width:80px;margin-top:10px;margin-right:27px">状态:</span>
                <span>{{ item.studentCardStatus ? item.studentCardStatus.name : '--' }}</span>

              </p>
            </div>
          </div>
        </div>
      </div>
      <div v-else class="gl_noData">
        <p>暂无数据</p>
      </div>
    </div>
    <div>
      <span slot="footer" class="difooter">
        <!-- 取消按钮 -->
        <el-button size="mini" @click="close">返回</el-button>
        <!-- 编辑的保存按钮 -->
        <el-button size="mini" type="primary" :loading="addfalse" @click="submit">确 定</el-button>
      </span>
    </div>
    <edit-salecard ref="editSalecard" />
  </div>
</template>

<script>
import { mapState, mapActions } from 'vuex';
import editSalecard from './editSaleCard.vue';
import { api_GET_ClubClass, api_GET_ClubCoach, api_PUT_ClubStudentStudentInfoStudentId, api_GET_ClubStudentCards, api_GET_ClubStudentStudentInfoStudentId, api_GET_ClubStudentCardsLogListSudentMembershipCardId } from '@/extend/api/hallswaggerApi/app.js';
import { StudentInfoInput, AddStudentInput, Api_GET_ClubClassQO, Api_GET_ClubCoachQO, Api_GET_ClubStudentCardsQO, Api_GET_ClubStudentCardsLogListSudentMembershipCardIdQO } from '@/lib/form/hall/swaggerForm';
export default {
  components: { editSalecard },
  props: {
    father: {
      type: Object,
      default() {
        return {};
      }
    }
  },
  data() {
    return {
      flag: true,
      cardname: '',
      tableLoading: false,
      teachfalse: false,
      classfalse: false,
      totalPage1: 0,
      totalPage: 0,
      addfalse: false,
      currentPage: 1,
      makeCard: [],
      Api_GET_ClubStudentCardsLogListSudentMembershipCardIdQO: new Api_GET_ClubStudentCardsLogListSudentMembershipCardIdQO(),
      cardTable: [], // 卡片列表
      studentContact: [], // 学员状态，
      coachNames: [], // 教练状态
      classNames: [], // 班级状态
      Contact: [],
      Api_GET_ClubStudentCardsQO: new Api_GET_ClubStudentCardsQO(),
      Api_GET_ClubCoachQO: new Api_GET_ClubCoachQO(),
      Api_GET_ClubClassQO: new Api_GET_ClubClassQO(),
      AddStudentInput: new AddStudentInput(), // 添加学员
      StudentInfoInput: new StudentInfoInput(), // 会籍资料
      tableTData: [],
      tableCData: [],
      dialogTeaVisible: false,
      dialogClasVisible: false,
      dialogCardVisible: false,
      dialogTimeVisible: false,
      teacher: [], //  教练
      sclass: [], //  班级
      classlist: [], // 班级列表
      coachlist: [], // 班级列表
      classlistData: [], // 班级数据
      coachlistData: [], // 教练数据
      formData: {
        imageUrl: ''
      }
    };
  },
  computed: {
    ...mapState({
      dict: state => state.dict.dict,
      cache: state => state.dict.cache,
      user: state => state.user.currentOU
    })
  },
  created() {
    this.getDict();
    console.log(this.dict.contactType);
    if (this.$route.query.id) {
      this.getStudent();
    }
  },
  methods: {
    ...mapActions({ getDict: 'dict/getDict' }),
    // 添加教练弹窗
    addTeacher() {
      for (var i = 0; i < this.coachlistData.length; i++) {
        if (this.coachlistData[i].operatorType !== 'D' && this.coachlistData.length > 0) {
          this.$message({
            type: 'success',
            message: '只能添加一位专属教练'
          });
          return;
        }
      }
      this.dialogTeaVisible = true;
      this.flag = true;
      this.Api_GET_ClubCoachQO = new Api_GET_ClubCoachQO();
      this.$nextTick(() => {
        this.$refs.multipleTable.clearSelection();
      });
      this.getteachlist();
    },
    getteachlist(page) {
      this.tableLoading = true;
      this.Api_GET_ClubCoachQO.IsEnabled = '';
      this.Api_GET_ClubCoachQO.CanTeach = true;
      this.Api_GET_ClubCoachQO.Sorting = 'creationTime DESC';
      this.Api_GET_ClubCoachQO.Page = page || 1;
      this.Api_GET_ClubCoachQO.SkipCount = (this.Api_GET_ClubCoachQO.Page - 1) * this.Api_GET_ClubCoachQO.MaxResultCount;
      api_GET_ClubCoach(this.Api_GET_ClubCoachQO).then(res => {
        this.coachlist = res.items;
        this.totalPage1 = res.totalCount;
        this.tableLoading = false;
        this.flag = true;
      }, error => {
        this.tableLoading = false;
        const _msg = error.error.message || error.message;
        this.$message({ type: 'error', message: _msg });
      });
    },
    // 添加班级弹窗
    addClass() {
      this.flag = true;
      this.sclass = [];
      this.dialogClasVisible = true;
      this.$nextTick(() => {
        this.$refs.multipleTable.clearSelection();
      });
      this.Api_GET_ClubClassQO = new Api_GET_ClubClassQO();
      this.getClasslist();
    },
    getClasslist(page) {
      console.log(this.classlistData);
      this.tableLoading = true;
      this.Api_GET_ClubClassQO.IncludeCourse = true;
      this.Api_GET_ClubClassQO.IncludeClassStudent = true;
      this.Api_GET_ClubClassQO.HasScheduledCourse = '';
      this.Api_GET_ClubClassQO.Sorting = 'creationTime DESC';
      this.Api_GET_ClubClassQO.Page = page || 1;
      this.Api_GET_ClubClassQO.SkipCount = (this.Api_GET_ClubClassQO.Page - 1) * this.Api_GET_ClubClassQO.MaxResultCount;
      api_GET_ClubClass(this.Api_GET_ClubClassQO).then(res => {
        this.classlist = res.items;
        this.totalPage = res.totalCount;
        this.tableLoading = false;
        this.flag = true;
      }, error => {
        this.tableLoading = false;
        const _msg = error.error.message || error.message;
        this.$message({ type: 'error', message: _msg });
      });
    },
    // 编辑卡片弹窗
    editCard(row) {
      console.log(row);
      this.$refs.editSalecard.addfalse = false;
      this.$refs.editSalecard.dialogVisible = true;
      this.$refs.editSalecard.currentId = row.id;
      this.$refs.editSalecard.studentName = row.studentName;
      this.$set(this.$refs.editSalecard.cardForm, 'name', row.name);
      this.$set(this.$refs.editSalecard.cardForm, 'chargeTypeCode', row.chargeTypeCode);
      this.$set(this.$refs.editSalecard.cardForm, 'cardNumber', row.cardNumber);
      this.$refs.editSalecard.cardForm.effectiveDate = row.effectiveDate;
      this.$refs.editSalecard.cardForm.remainClassPeriod = row.remainClassPeriod;
    },
    // 卡片记录查看
    timeCard() {
      this.dialogTimeVisible = true;
    },
    getStudent() {
      api_GET_ClubStudentStudentInfoStudentId(this.$route.query.id).then(res => {
        this.StudentInfoInput.studentNumber = res.studentNumber;
        this.StudentInfoInput.joiningTime = res.joiningTime;
        this.Contact = res.studentContacts;
        for (var i = 0; i < this.Contact.length; i++) {
          this.Contact[i].operatorType = '';
        }
        this.coachlistData = res.coachNames;
        this.classlistData = res.classNames;
        console.log(this.classlistData);
      }, error => {
        const _msg = error.error.message || error.message;
        this.$message({ type: 'error', message: _msg });
      });
      this.Api_GET_ClubStudentCardsQO.IsStudentCardEnabled = true;
      this.Api_GET_ClubStudentCardsQO.StudentCardStatusCode = 'Enable';
      this.Api_GET_ClubStudentCardsQO.IncludeStudentCardStatus = true;
      this.Api_GET_ClubStudentCardsQO.IncludeRegisterStudent = false;
      this.Api_GET_ClubStudentCardsQO.IncludeMembershipCard = false;
      this.Api_GET_ClubStudentCardsQO.RegisterStudentId = this.$route.query.id;
      api_GET_ClubStudentCards(this.Api_GET_ClubStudentCardsQO).then(res => {
        console.log(res);
        this.cardTable = res.items;
      }, error => {
        const _msg = error.error.message || error.message;
        this.$message({ type: 'error', message: _msg });
      });
    },
    // 添加班级
    addC() {
      this.addfalse = true;
      var arrar = [];
      for (var n = 0; n < this.sclass.length; n++) {
        var flagg = true;
        for (var m = 0; m < this.classlistData.length; m++) {
          if (this.sclass[n].classId === this.classlistData[m].classId) {
            if (this.classlistData[m].operatorType) {
              if (this.classlistData[m].operatorType === 'D') {
                flagg = true;
                continue;
              }
            } else {
              flagg = false;
              continue;
            }

            flagg = false;
            continue;
          }
        }
        if (flagg) {
          arrar.push(this.sclass[n]);
        }
      }
      console.log(arrar);
      this.classlistData.push(...arrar);
      for (var i = 0; i < this.classlistData.length; i++) {
        this.classlistData[i].index = i;
      }
      if (this.sclass.length === 0) {
        this.$message('请选择班级');
        this.addfalse = false;
        return;
      }
      setTimeout(() => {
        this.classNames = this.classlistData;
        this.dialogClasVisible = false;
        this.addfalse = false;
      }, 1000);
    },
    addT() {
      this.addfalse = true;
      this.coachlistData.push(this.teacher[0]);
      console.log(this.coachlistData);
      for (var i = 0; i < this.coachlistData.length; i++) {
        this.coachlistData[i].index = i;
      }
      if (this.teacher.length === 0) {
        this.$message('请选择教练');
        this.addfalse = false;
        return;
      }
      setTimeout(() => {
        this.coachNames = this.coachlistData;
        this.dialogTeaVisible = false;
        this.addfalse = false;
      }, 1000);
    },
    // 选中的数据
    selectionclass(val) {
      if (this.flag) {
        this.sclass = [];
        if (val.length > 0) {
          for (var i = 0; i < val.length; i++) {
            const shu = {};
            shu.classId = val[i].id;
            shu.operatorType = 'I';
            shu.name = val[i].name;
            this.sclass.push(shu);
          }
        }
      }
    },
    selectioncoach(val) {
      if (this.flag) {
        this.teacher = [];
        if (val.length > 0) {
          if (val.length > 1) {
            this.$refs.multipleTable.clearSelection();
            this.$refs.multipleTable.toggleRowSelection(val.pop());
          }
          for (var i = 0; i < val.length; i++) {
            const shu = {};
            shu.id = val[i].id;
            shu.operatorType = 'I';
            shu.name = val[i].name;
            this.teacher.push(shu);
          }
        }
      }
    },
    submit() {
      console.log(this.Contact);
      for (var i = 0; i < this.Contact.length; i++) {
        if (this.Contact) {
          if (this.Contact[i].phoneNumber === undefined || this.Contact[i].contactTypeCode === undefined) {
            this.$message('请填写完整紧急联系方式');
            return;
          }
          if (this.Contact[i].operatorType && this.Contact[i].phoneNumber) {
            this.StudentInfoInput.studentContact.push(this.Contact[i]);
          }
        }
      }
      for (var j = 0; j < this.coachlistData.length; j++) {
        if (this.coachlistData[j].operatorType) {
          this.StudentInfoInput.coachNames.push(this.coachlistData[j]);
        }
      }
      for (var n = 0; n < this.classlistData.length; n++) {
        if (this.classlistData[n].operatorType) {
          if (this.classlistData[n].operatorType !== 'D' || this.classlistData[n].id) {
            this.StudentInfoInput.classNames.push(this.classlistData[n]);
          }
        }
      }

      for (var m = 0; m < this.StudentInfoInput.classNames.length; m++) {
        if (this.StudentInfoInput.classNames[m].id === undefined) {
          if (this.StudentInfoInput.classNames[m].operatorType === 'D') {
            if (this.StudentInfoInput.classNames[m]) {
              this.StudentInfoInput.classNames.splice(m, 1);
              m--;
            }
          }
        }
      }
      console.log(this.StudentInfoInput.classNames);
      var len = this.StudentInfoInput.classNames.length;
      for (i = 0; i < len; i++) {
        for (j = i + 1; j < len; j++) {
          if (this.StudentInfoInput.classNames[i].classId === this.StudentInfoInput.classNames[j].classId) {
            this.StudentInfoInput.classNames.splice(j, 1);
            len--;
            j--;
          }
        }
      }

      this.addfalse = true;
      console.log(this.StudentInfoInput);
      this.addfalse = false;
      api_PUT_ClubStudentStudentInfoStudentId(this.$route.query.id, this.StudentInfoInput).then((res) => {
        console.log(res);
        this.$message({
          message: '提交成功',
          type: 'success'
        });
        this.addfalse = false;
        this.$router.push({ 'name': 'StudentList' });
      }, error => {
        this.StudentInfoInput.studentContact = [];
        this.StudentInfoInput.coachNames = [];
        const _msg = error.error.message || error.message;
        this.$message({ type: 'error', message: _msg });
        this.addfalse = false;
      });
    },
    addContact() {
      console.log(this.Contact);
      const shu = {
        operatorType: 'I',
        id: ''
      };
      this.Contact.push(shu);
    },
    closeT(tag) {
      const _arr = this.coachlistData;
      _arr[tag].operatorType = 'D';
      this.coachlistData = [..._arr];
    },
    closeC(tag) {
      const _arr = this.classlistData;
      _arr[tag].operatorType = 'D';
      this.classlistData = [..._arr];
    },
    colseContact(tag) {
      if (this.Contact[tag].id) {
        const _arr = this.Contact;
        _arr[tag].operatorType = 'U';
        this.Contact = [..._arr];
      }
    },
    stopContact(tag) {
      if (this.Contact[tag].id) {
        // this.Contact[tag].operatorType = 'D';
        // console.log(this.Contact);
        // this.$set(this.Contact[tag], 'operatorType', 'D');
        const _arr = this.Contact;
        _arr[tag].operatorType = 'D';
        this.Contact = [..._arr];
        // console.log(this.Contact[tag]);
      } else {
        this.Contact.splice(tag, 1);
      }
    },
    // 查看卡片操作记录
    checkCard(row) {
      console.log(row);
      this.dialogTimeVisible = true;
      this.cardname = row.name;
      api_GET_ClubStudentCardsLogListSudentMembershipCardId(row.id, this.Api_GET_ClubStudentCardsLogListSudentMembershipCardIdQO).then(res => {
        console.log(res);
        this.makeCard = res.items;
      });
    },
    close() {
      this.$router.push({ name: 'StudentList' });
    },
    sizeChange(MaxResultCount) {
      this.Api_GET_ClubClassQO.MaxResultCount = MaxResultCount;
      this.getClasslist();
    },
    pageIndexChange(currentPage) {
      console.log(currentPage);
      this.flag = false;
      this.getClasslist(currentPage);
    },
    sizeChange1(MaxResultCount) {
      this.Api_GET_ClubClassQO.MaxResultCount = MaxResultCount;
      this.getteachlist();
    },
    pageIndexChange1(currentPage) {
      console.log(currentPage);
      this.flag = false;
      this.getteachlist(currentPage);
    }
  }
};
</script>

<style lang="scss" scoped>
.nav{
  display: flex;
  flex-wrap: wrap;
}
.nav_card {
   display: flex;
  flex-wrap: wrap;
}
 ::v-deep .el-card__header{
  background: rgba(64,158,255,0.06);
}
 ::v-deep .card .el-form-item__label {
   font-size: 13px;
   color: #999999;
 }
 ::v-deep .time .el-card__header{
   background-color: #F1F1F1;
   border-bottom: 0px;
 }
 .difooter {
  display: inline-block;
  margin-top: 20px;
  margin-left: 50%;
  transform: translateX(-50%);
}
// .classroom {
//   display: inline-block;
//   width: 120px;
//   height: 28px;
//   border: 1px solid rgb(106, 156, 250);
//   text-align: center;
//   line-height: 28px;
//   font-size: 16px;
//   margin-right: 10px;
// }
::v-deep input::-webkit-outer-spin-button,
::v-deep input::-webkit-inner-spin-button {
  -webkit-appearance: none !important;
}
::v-deep input[type='number'] {
  -moz-appearance: textfield !important;
}
.makepeople {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
display:inline-block;
width:130px;
}
::v-deep .table_teach .el-table__header-wrapper  .el-checkbox{
  display:none;
}
.member_card {
  display: inline-block;
  color:#409EFF;
  font-size:20px;
  width: 240px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;

}
.edit_name {
  display: inline-block;
font-size:16px;
color:#353434;
width: 500px;
white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
</style>
